<!--suppress ALL -->
<template>
    <div class="page eqmentMsg-page" data-page="policeHistoryDetail" style="z-index: 2;">
        <div class="link-page-nav">
            <a href="#" class="link" @click="$root.backToTab">
                <i class="iconfont icon-zuo"></i>
            </a>
        </div>
        <div class="link-page-top">
            <div class="link-page-title">警情详情
                <span id="tagReset_{{getNewId}}" class="tag-reset">已复位</span>
            </div>
            <!-- <a href="#" class="link" @click="openConfirm">
               <i class="iconfont icon--" id="noAttention" style="font-size: 23px;"></i> 
               <i class="iconfont icon--" id="attention" style="font-size: 23px;display: none;"></i>
            </a> -->
        </div>
        <div class="page-content ptr-content" style="padding-bottom: 100px;" data-ptr-distance="55" data-ptr-mousewheel="true" @ptr:refresh="refreshData">
            <div class="ptr-preloader">
                <div class="preloader"></div>
                <div class="ptr-arrow"></div>
              </div>
            <div class="list media-list">
                <ul>
                    <li>
                        <a href="#" class="item-link item-content">
                            <div class="item-media">
                                <img src="" id="myicon_{{getNewId}}" class="myicon" width="80" style="height:auto">
                            </div>
                            <div class="item-inner">
                                <div class="item-title-row" style="padding-right: 0;">
                                    <div class="item-title" style="white-space: normal;">
                                        <span id="decterType_{{getNewId}}"></span>
                                        <span class="decter-name" id="decter_name_{{getNewId}}"></span>
                                    </div>
                                </div>
                                <div class="item-subtitle decter-mesage" id="decter_address_{{getNewId}}"></div>
                                <div class="item-text">
                                    <span class="decter-mesage">持续时间</span>
                                    <span class="decter-key-mesage" id="decter_continue_time_{{getNewId}}"></span>
                                </div>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="line-hr"></div>
            <div class="sw-tabs is-black" style="margin-bottom: 10px;">
                <div id="tabReset_{{getNewId}}" class="sw-tabs__item is-active tab-reset-pic" @click="togglePic(0)">复位图片</div>
                <div class="sw-tabs__item" @click="togglePic(1)">报警图片</div>
            </div>
            <div class="every-type-chart-wrap">
                <!-- 这里有图片信息 -->
                <div id="history_topChartContain_{{getNewId}}"></div>
                <table class="decter-table-content history-decter-table" id="history_decter_table_{{getNewId}}">
                    <thead>
                        <tr style="color: #999;">
                            <td>类型</td>
                            <td>A相</td>
                            <td>B相</td>
                            <td>C相</td>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>温度</td>
                            <td id="history_decterMes_36_{{getNewId}}">-</td>
                            <td id="history_decterMes_37_{{getNewId}}">-</td>
                            <td id="history_decterMes_38_{{getNewId}}">-</td>
                        </tr>
                        <tr class="policeHistory-electricity" id="policeHistory_electricity_{{getNewId}}">
                            <td>电流</td>
                            <td id="history_decterMes_33_{{getNewId}}">-</td>
                            <td id="history_decterMes_34_{{getNewId}}">-</td>
                            <td id="history_decterMes_35_{{getNewId}}">-</td>
                        </tr>
                        <tr class="policeHistory-voltage" id="policeHistory_voltage_{{getNewId}}">
                            <td>电压</td>
                            <td id="history_decterMes_30_{{getNewId}}">-</td>
                            <td id="history_decterMes_31_{{getNewId}}">-</td>
                            <td id="history_decterMes_32_{{getNewId}}">-</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="line-hr"></div>
            <div class="list">
                <ul>
                    <li class="decter-block-title">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner" style="background-image:none;">
                                <div class="item-title">
                                    <span id="policeHistory_rest_detail_{{getNewId}}">已复位</span>
                                </div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">复位方式</div>
                                <div class="item-after-history" id="policeHistory_rest_type{{getNewId}}">-</div>
                                <i class="iconfont icon-question" @click="policeHistory_rest_typeFun"></i>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">发生时间</div>
                                <div class="item-after-history" id="msg_openTime_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">复位时间</div>
                                <div class="item-after-history" id="msg_restTime_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner" style=" align-items: flex-start;">
                                <div class="item-title">警情明细</div>
                                <div class="item-after-history" id="msg_policeDetail_{{getNewId}}" style="white-space: initial;">-
                                </div>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="line-hr"></div>
            <div class="list" id="deal_police_{{getNewId}}">
                <ul>
                    <li class="decter-block-title">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner" style="background-image:none;">
                                <div class="item-title">
                                    <span>处理记录</span>
                                </div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">处理状态：</div>
                                <div class="item-after-history" id="dealmsg_status_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message is-ladder-control">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner is-ladder">
                                <div class="item-title" style="width: 110px;">是否禁用梯控：</div>
                                <div class="item-after-history" id="ladder_control_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <div>
                        <li class="decter-block-basic-message nullItem">
                            <a href="#" class="item-link item-content">
                                <div class="item-inner">
                                    <div class="item-title">填&nbsp;&nbsp;写&nbsp;&nbsp;人：</div>
                                    <div class="item-after-history" id="dealmsg_person_{{getNewId}}">-</div>
                                </div>
                            </a>
                        </li>
                        <div>
                            <li class="decter-block-basic-message nullItem">
                                <a href="#" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title" id="dealTypeTime_{{getNewId}}">处理时间：</div>
                                        <div class="item-after-history" id="dealmsg_dealTime_{{getNewId}}">-</div>
                                    </div>
                                </a>
                            </li>
                            <li class="decter-block-basic-message dealType"  >
                                <a href="#" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">处理类型：</div>
                                        <div class="item-after-history" id="dealmsg_dealType_{{getNewId}}">-</div>
                                    </div>
                                </a>
                            </li>
                            <li class="decter-block-basic-message dealType">
                                <a href="#" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注：
                                        </div>
                                        <div class="item-after-history" id="dealmsg_remark_{{getNewId}}">-</div>
                                    </div>
                                </a>
                                <div class="item-content" id="voice_content_{{getNewId}}">
                                    <div class="item-media1" id="dealmsg_voice_{{getNewId}}" style="margin-left: 24%;">
                                        <!-- <img class="tb-voice-png" style="float: left;" src='../img/apply/novoicePlay.png'>
                                                                    <p style="color:#d1d1d1;">无语音</p> -->
                                    </div>
                                </div>
                            </li>
                            <li class="decter-block-basic-message dealType">
                                <a href="#" class="item-link item-content">
                                    <div class="item-inner">
                                        <div class="item-title">现场图片：</div>
                                        <div class="item-after-history" id="dealmsg_img_{{getNewId}}" style="width:78%;"></div>
                                    </div>
                                </a>
                            </li>
                            <li class="decter-block-basic-message dealType" id="police_relate_emgency_{{getNewId}}">
                                <a href="#">
                                    <div style="margin-left: 15px;margin-right: 13px;margin-bottom: 20px;">
                                        <div class="item-title" style="color: #999;font-size: 14px;">关联预案：</div>
                                        <div class="dealmsg-emergency-btn" @click="backToPlanInfo">
                                            <a href="#">
                                                <div class="dealmsg-relate-plan">
                                                    <span class="iconfont icon-noun__cc"></span>相关预案
                                                </div>
                                            </a>
                                            <div style="margin-left: 19px;" id="police_relate_emgency_name_{{getNewId}}">-</div>
                                        </div>
                                    </div>
                                </a>
                            </li>
                        </div>
                    </div>
                </ul>
            </div>
            <div class="line-hr"></div>

            <div class="list">
                <ul>
                    <li class="decter-block-title">
                        <a href="#" class="item-link item-content decter_video_num_video" id="decter_video_{{getNewId}}">
                            <div class="item-inner">
                                <div class="item-title">
                                    <span>附近监控</span>
                                </div>
                                <div class="item-after decter_video_num" id="decter_video_num_{{getNewId}}">无</div>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="line-hr"></div>
            <div class="list">
                <ul>
                    <li class="decter-block-title">
                        <a href="#" @click="IndoorMap"  class="item-link item-content" id="fmapHerf_{{getNewId}}">
                            <div class="item-inner">
                                <div class="item-title">
                                    <span>室内定位</span>
                                </div>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="line-hr"></div>
            <div class="list">
                <ul>
                    <li class="decter-block-title">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner" style="background-image:none;">
                                <div class="item-title">
                                    <span>基本信息</span>
                                </div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">所属单位</div>
                                <div class="item-after" id="msg_11_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">所属建筑</div>
                                <div class="item-after" id="msg_21_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">所属系统</div>
                                <div class="item-after" id="msg_31_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">设备厂家</div>
                                <div class="item-after" id="msg_41_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                    <li class="decter-block-basic-message">
                        <a href="#" class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title">入网时间</div>
                                <div class="item-after" id="msg_51_{{getNewId}}">-</div>
                            </div>
                        </a>
                    </li>
                </ul>
            </div>
            <div class="policeHistoryDetail-cancel-btn-1" id="policeHistoryDetail_quit_{{getNewId}}" @click="quitCancel">立即处理</div>
            <div class="policeHistoryDetail-cancel-btn policeHistoryDetail-cancel-btn-2" id="policeHistoryDetail_quit2_{{getNewId}}">
                <div @click="gotoRealPolice" class="note">注:以上为历史警情状态，不是实时状态，点击查看实时状态</div>
                <div class="blue" id="policeHistoryDetail_quit3_{{getNewId}}">立刻查看设备实时状态</div>
            </div>
            <div id="handel-protect-test_{{getNewId}}" class="handel-protect-test" @click="handelTest()"><u>快速处理为“维保测试引起”</u></div>
        </div>
    </div>
    </div>
</template>
<style scoped>
    .sw-tabs{
        display: none;
    }
    .sw-tabs.is-show{
        display: block;
    }
    .link-page-title{
        display: flex;
        align-items: center;
    }
    .tab-reset-pic{
        display: none;
    }
    .tab-reset-pic.is-show{
        display: inline-block;
    }
    .tag-reset{
        display: none;
        margin-left: 10px;
        padding: 0 10px;
        border: 1px solid #57b74f;
        font-size: 14px;
        height: 24px;
        line-height: 26px;
        color: #57b74f;
    }
    .tag-reset.is-show{
        display: inline;
    }
    .swiper-container {
        width: 100%;
        height: 180px;
        margin: 0 auto;
        position: relative;
        overflow: hidden;
        list-style: none;
        padding: 0;
        z-index: 1;
    }
    .swiper-pagination {
        /* width: 100%;
        height: 21px; */
        position: absolute;
        text-align: center;
        -webkit-transition: .3s opacity;
        transition: .3s opacity;
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        z-index: 10;
        bottom: 0px;
    }
    .swiper-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        z-index: 1;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-transition-property: -webkit-transform;
        transition-property: -webkit-transform;
        transition-property: transform;
        transition-property: transform,-webkit-transform;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
    }
    .handel-protect-test {
        text-align: center;
        padding-top: 20px;
        padding-bottom: 20px;
        color: #ff0000;
        display: none;
    }
    .is-ladder{
        display: inline-flex;
        align-items: flex-start;
    }
    .item-media1 {
        padding: 0;
        width: 71%;
        height: 36px;
        margin-top: 14px;
        min-width: 40px;
        line-height: 32px;
        margin: auto;
    }

    .tb-voice {
        width: 74px;
        height: 32px;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        background-color: #efefef;
        border-radius: 4px;
        line-height: 32px;
        margin: auto;
    }

    .tb-voice-gif {
        height: 16px !important;
        width: 13px !important;
        margin: 3px;
    }

    .tb-voice-png {
        height: 16px !important;
        width: 13px !important;
        margin: 8px;
    }

    .dealmsg-relate-plan {
        color: #04A9FF;
        font-size: 10px;
        padding-left: 2px;
    }

    .history-decter-table {
        display: none;
    }

    .policeHistoryDetail-cancel-btn-1 {
        margin: 15px auto;
        width: 90%;
        height: 40px;
        line-height: 40px;
        border-radius: 2px;
        font-size: 15px;
        color: #fff;
        text-align: center;
        background-color: #378bf6;
    }

    .policeHistoryDetail-cancel-btn {
        margin: 15px auto;
        width: 90%;
        height: 40px;
        line-height: 40px;
        border-radius: 2px;
        font-size: 15px;
        color: #fff;
        text-align: center;
    }

    .no-reset {
        color: #f8b728;
    }

    .dealmsg-emergency-btn {
        margin: 2px auto;
        width: 100%;
        border-radius: 2px;
        background-color: #F9F9F9;
        font-size: 15px;
        color: #666666;
        text-align: left;
        height: 46px;
    }

    .group-name {
        float: left;
        text-align: left;
        width: 48%;
        font-size: 14px;
        color: #333333;
    }

    .group-person {
        float: left;
        width: 20%;
        text-align: right;
    }
    .member-phone {
        text-align: right;
        color: #5683EF;
    }

    .dealmsg-img-item {
        width: 30%;
        float: left;
        display: inline-block;
        margin-left: 3%;
    }

    .dealmsg-img-item img {
        width: 100%;
        height: 80px;
        border-radius: 5px;
    }

    .decter-block-basic-message .item-title {
        width: 77px;
    }

    .item-after-history {
        width: calc(100% - 85px);
        padding-left: 0;
    }

    .history-decter-table {
        width: 85%;
        margin: 0 auto;
    }

    .policeHistory-electricity,
    .policeHistory-voltage{
        display: none;
    }

    .policeHistoryDetail-cancel-btn-2 {
        margin: 0 auto;
        text-align: center;
        height: auto;
        padding: 30px 18px;
        padding-top: 0;
    }

    .policeHistoryDetail-cancel-btn-2 .blue {
        width: 100%;
        height: 40px;
        line-height: 40px;
        border-radius: 2px;
        margin: 0 auto;
        background-color: #378bf6;
    }

    .policeHistoryDetail-cancel-btn-2 .note {
        color: red;
        width: 100%;
        text-align: left;
        padding: 3px 0;
        font-size: 12px;
        text-decoration: underline;
    }
    .hide{
        display: none;
    }
    .no-hasAnalog{
        display: inline-flex;
        align-items: center;
        justify-content: space-around;
    }
    .right-num{
        top: 34%;
        max-width: 45%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-left: 18px;
    }
</style>
<script>
return {
        data: function() {
            return {
                id: this.$route.params.id,
                policeId:'',
                testOrgId:'',
                organizationId: 0,
                orgId:0,
                isConcern: 0,
                gifPath: staticPath+"img/apply/voicePlay.gif",
                imgPath: staticPath+"img/apply/voicePlaywhite.png" ,
                noimgPath:staticPath+"img/apply/novoicePlay.png",
                videoBean : {},//播放视频信息,
                planId:0,//预案id
                handlerStatus:0,
                dataTypeIdArr_history : ["30", "31", "32", "33", "34", "35", "36", "37", "38", "39"],//组合式电气火灾探测器
                isPoliceTest:false,
                fireSTypes:'',
                fcFacilitiesId:'',
                getNewId: (new Date()).getTime(),
                isReset:0,
                imgcanvasW: 0, //图片宽度是根据屏幕宽度适配，要获取具体px，
                imgcanvasH: 0, //图片高度是死的，放心食用
                ctx: '',
                canvas: '',
                detailValie: {}, // 详情总数据
                frameArr: [], // 报警红框数组
                picObj: {},// 报警原图片对象
                image_A: '',

                imgcanvasW_R: 0, //图片宽度是根据屏幕宽度适配，要获取具体px，
                imgcanvasH_R: 0, //图片高度是死的，放心食用
                ctx_R: '',
                canvas_R: '',
                frameArr_R: [], // 报警红框数组
                picObj_R: {}, // 报警原图片对象
                image_R: ''

            }
        },
        mounted() {
        },
        methods: {
            togglePic(index){
                $('.eqmentMsg-page').find('.sw-tabs__item').removeClass('is-active')
                $('.eqmentMsg-page').find('.sw-tabs__item').eq(index).addClass('is-active')
                if(!this.isReset) return
                var swiper = app.swiper.get('#hiddenCheck-swiper_'+this.getNewId);
				swiper&&swiper.slideTo(index); // 更新滑块
            },
            // ----------------------------- canvas 画框开始 ----------------------------
            // 报警图片加载完毕
            vanimageLoad() {
                if(!this.detailValie) return
                var self = this;
                let Kline = document.getElementById('imagetoAlarm') 
                self.imgcanvasW = Kline.clientWidth
                self.imgcanvasH = Kline.clientHeight
                let resultRegion = self.detailValie.picAlarmRegion;
                if (resultRegion) {
                    resultRegion = JSON.parse(resultRegion);
                    // 图片红框数组
                    self.frameArr = []
                    self.frameArr.push(JSON.parse(resultRegion.frameInfo));
                    var regionArr=[]
                    if(resultRegion.region){
                        regionArr=resultRegion.region.split(';').map(n=>{
                            return JSON.parse(n)
                        })
                    }
                    // 图片原始大小
                    self.picObj = resultRegion.imageInfo;
                    self.picObj.width = parseInt(self.picObj.width);
                    self.picObj.height = parseInt(self.picObj.height);
                    self.doDrawPic(self.frameArr,regionArr)
                }
            },
            // 画canvas图片 （功能：获取vanvas画布 and 画红框）
            doDrawPic: function (value,regionArr) {
                // 以下代码展示的视图层级是： 1。最低层是image   2.image上面覆盖一层透明的没有绘制的空的vanvas   3.vanvas上面是红框
                let self = this
                //  获取canvas
                self.canvas = document.getElementById("policeHistoryDetail_scaleImg_")
                //  由于弹窗，确保已获取到
                self.ctx = self.canvas.getContext('2d')
                //  绘制图片 （注意：这里不必把canvas绘制出来，有一个底图image显示就够了）
                // var img=document.getElementById('imagetoAlarm') 
                let img = document.getElementById('imagetoAlarm');
                img.src = self.picObj.pic;
                var imgWidth, imgHeight;
                var w = self.picObj.width/2
                img.onload = () => {
                    
                    imgWidth = self.picObj.width;
                    imgHeight = self.picObj.height;

                    // 压缩图片大小
                    if (Math.max(imgWidth, imgHeight) > w) {
                        if (imgWidth > imgHeight) {
                            self.canvas.width = w;
                            self.canvas.height = w * imgHeight / imgWidth;
                        } else {
                            self.canvas.height = w;
                            self.canvas.width = w * imgWidth / imgHeight;
                        }
                    } else {
                        self.canvas.width = imgWidth;
                        self.canvas.height = imgHeight;
                    }
                    self.ctx.clearRect(0, 0, self.canvas.width, self.canvas.height);
                    // var ctx = canvas.getContext('2d');
                    self.ctx.drawImage(img, 0, 0, self.canvas.width, self.canvas.height);
                    regionArr.forEach(n=>{
                        self.drawRegion(n)
                    })
                    // 在canvas上绘制红框
                    self.drawRecRed(value)
                }
            },
            // 画蓝框区域
            drawRegion(arr,ctxProp='ctx') {
                var self=this
                var ctx=self[ctxProp]
                if (!arr || arr.length == 0) return
                ctx.strokeStyle = 'blue'
                ctx.lineWidth = 3
                arr.forEach((item, i) => {
                    let x = (item.x || 0) /2
                    let y = (item.y || 0) /2
                    if (i == 0) {
                        ctx.moveTo(x, y)
                    } else {
                        ctx.lineTo(x, y)
                        if (i == arr.length - 1) {
                            ctx.lineTo(arr[0].x/2, arr[0].y/2)
                        }
                    }
                })
                ctx.stroke();
            },
            // 画红框
            drawRecRed(value) {
                if (value) {
                    let self = this
                    // BiLSizeW  BiLSizeW 图片分辨率的比例   因为红框标注是1920*1080下的大小，不适合app，我需要通过分辨率转一下
                    // this.picObj.width this.picObj.height 原图片大小1920*1080
                    // const BiLSizeW = self.imgcanvasW / self.picObj.width
                    // const BiLSizeH = self.imgcanvasH / self.picObj.height
                    
                    // 绘制矩形上面的文字
                    self.ctx.strokeStyle = 'red'
                    self.ctx.lineWidth = 2
                    self.ctx.font = "30px Georgia";
                    self.ctx.fillStyle = 'red'
                    // 循环判断有几个红框  
                    for (let i = 0; i < value[0].length; i++) {
                        let x = (value[0][i].x/2 || 0)
                        let y = (value[0][i].y/2 || 0)
                        let w = (value[0][i].w/2 || 0)
                        let h = (value[0][i].h/2 || 0)
                        if (value[0][i].x/2 === undefined) {
                            
                            // a.如果没有宽高，则只在左上角显示类型
                            x = 15;
                            y = 40;
                            y = y < 37.5 ? 37.5 : y;
                        }else {
                            // 绘制矩形
                            self.ctx.strokeRect(
                                x, // 红框x
                                y, // 红框y
                                w, // 红框w
                                h // 红框h
                            );
                            // c. 文字+图像，文字超过顶，文字放到框下方
                            if(y<30){
                                y = y+h+30
                            }
                            // b. 文字+图像，默认文字在框上
                            else{
                                y -= 12.5
                            }
                            // d. 文字+图像，文字超过右侧，文字右对齐 
                            let textW = (value[0][i].typeName || '').length*30
                            let rDistance = self.canvas.width - x
                            if(rDistance<textW){
                                x = x + w - textW
                            }
                        }
                        // 如果没有宽高，则只在左上角显示类型
                        self.ctx.fillText(
                            value[0][i].typeName || '', //文字name
                            x , // 文字x轴
                            y // 文字y轴
                        )
                    }
                    self.image_A = self.canvas.toDataURL("image/png", 0.5)
                    common.loading(0);
                }
            },
            // 复位图片加载完毕
            vanimageLoadReset() {
                if(!this.detailValie) return
                var self = this;
                let Kline = document.getElementById('imagetoReset') 
                self.imgcanvasW_R = Kline.clientWidth
                self.imgcanvasH_R = Kline.clientHeight
                let resultRegion = self.detailValie.picResetRegion;
                if (resultRegion) {
                    resultRegion = JSON.parse(resultRegion);
                    // 图片红框数组
                    self.frameArr_R = []
                    self.frameArr_R.push(JSON.parse(resultRegion.frameInfo));
                    var regionArr=[]
                    if(resultRegion.region){
                        regionArr=resultRegion.region.split(';').map(n=>{
                            return JSON.parse(n)
                        })
                    }
                    // 图片原始大小
                    self.picObj_R = resultRegion.imageInfo;
                    self.picObj_R.width = parseInt(self.picObj_R.width);
                    self.picObj_R.height = parseInt(self.picObj_R.height);
                    self.doDrawPicReset(self.frameArr_R,regionArr)
                }
            },
            // 画canvas图片 （功能：获取vanvas画布 and 画红框）
            doDrawPicReset: function (value,regionArr) {
                // 以下代码展示的视图层级是： 1。最低层是image   2.image上面覆盖一层透明的没有绘制的空的vanvas   3.vanvas上面是红框
                let self = this
                //  获取canvas
                self.canvas_R = document.getElementById("policeHistoryDetail_scaleImgReset_")
                //  由于弹窗，确保已获取到
                self.ctx_R = self.canvas_R.getContext('2d')
                //  绘制图片 （注意：这里不必把canvas绘制出来，有一个底图image显示就够了）
                // var img=document.getElementById('imagetoReset') 
                // self.ctx_R.drawImage(img, 0, 0, self.imgcanvasW_R, self.imgcanvasH_R) 
                // // 在canvas上绘制红框
                // self.drawRecRedReset(value)

                let img = document.getElementById('imagetoReset');
                img.src = self.picObj_R.pic;
                var imgWidth, imgHeight;
                var w = self.picObj_R.width/2
                img.onload = () => {
                    imgWidth = self.picObj_R.width;
                    imgHeight = self.picObj_R.height;

                    // 压缩图片大小
                    if (Math.max(imgWidth, imgHeight) > w) {
                        if (imgWidth > imgHeight) {
                            self.canvas_R.width = w;
                            self.canvas_R.height = w * imgHeight / imgWidth;
                        } else {
                            self.canvas_R.height = w;
                            self.canvas_R.width = w * imgWidth / imgHeight;
                        }
                    } else {
                        self.canvas_R.width = imgWidth;
                        self.canvas_R.height = imgHeight;
                    }
                    self.ctx_R.clearRect(0, 0, self.canvas_R.width, self.canvas_R.height);
                    // var ctx = canvas.getContext('2d');
                    self.ctx_R.drawImage(img, 0, 0, self.canvas_R.width, self.canvas_R.height);
                    regionArr.forEach(n=>{
                        self.drawRegion(n,'ctx_R')
                    })
                    // 在canvas上绘制红框
                    self.drawRecRedReset(value)
                }
            },
            // 画红框
            drawRecRedReset(value) {
                if (value) {
                    let self = this
                    // BiLSizeW  BiLSizeW 图片分辨率的比例   因为红框标注是1920*1080下的大小，不适合app，我需要通过分辨率转一下
                    // this.picObj.width this.picObj.height 原图片大小1920*1080
                    // const BiLSizeW = self.imgcanvasW_R / self.picObj_R.width
                    // const BiLSizeH = self.imgcanvasH_R / self.picObj_R.height

                    // 绘制矩形上面的文字
                    self.ctx_R.strokeStyle = 'red'
                    self.ctx_R.lineWidth = 2
                    self.ctx_R.font = "30px Georgia";
                    self.ctx_R.fillStyle = 'red'
                    // 循环判断有几个红框  
                    for (let i = 0; i < value[0].length; i++) {
                        let x = (value[0][i].x/2 || 0)
                        let y = (value[0][i].y/2 || 0)
                        let w = (value[0][i].w/2 || 0)
                        let h = (value[0][i].h/2 || 0)
                        if (value[0][i].x/2 === undefined) {
                            
                            // 如果没有宽高，则只在左上角显示类型
                            x = 15;
                            y = 40;
                            y = y < 37.5 ? 37.5 : y;
                        }else {
                            // 绘制矩形
                            self.ctx_R.strokeRect(
                                x, // 红框x
                                y, // 红框y
                                w, // 红框w
                                h // 红框h
                            );
                            // c. 文字+图像，文字超过顶，文字放到框下方
                            if(y<30){
                                y = y+h+30
                            }
                            // b. 文字+图像，默认文字在框上
                            else{
                                y -= 12.5
                            }
                            // d. 文字+图像，文字超过右侧，文字右对齐 
                            let textW = (value[0][i].typeName || '').length*30
                            let rDistance = self.canvas_R.width - x
                            if(rDistance<textW){
                                x = x + w - textW
                            }
                        }
                        // 如果没有宽高，则只在左上角显示类型
                        self.ctx_R.fillText(
                            value[0][i].typeName || '', //文字name
                            x , // 文字x轴
                            y // 文字y轴
                        )
                    }
                    self.image_R = self.canvas_R.toDataURL("image/png", 0.5)
                    common.loading(0);
                }
            },
            // ----------------------------- canvas 画框结束 ----------------------------
            backToRefresh:function(){
                var self = this;
                self.getPoliceDetail();
                self.findVedioNum(self.id);
                self.emergencyPlan(self.id);
            },
            //复位方式弹窗
            policeHistory_rest_typeFun:function(){
                let html = `
    <div class="popup org-popup" style="height: 66% !important">
        <div class="rdsp-org-popup">
            <div class="rdsp-org-popup-top">
                <span style="font-size:16px;color: #000;">复位方式</span>
                <div class="rdsp-org-list-tags" id="orgRecord_list">
                    <div style="margin-bottom:20px">复位：设备从警情状态恢复到正常状态。复位方式包含自复位和处理后复位</div>
                    <div style="margin-bottom:20px">自复位：设备是否复位取决于设备现场是否复位。标准的设备都是这种</div>
                    <div style="margin-bottom:20px">处理后复位：因为硬件不提供复位信息，所以在人工对警情处理后，系统默认复位。这种情况下，系统展示设备状态可能与实际的设备状态不符，请注意</div>
                    <div>您可以根据设备的实际复位逻辑，通过【接警席==》系统设置==》物联设备维护】来修改复位方式。</div>
                </div>
            </div>
            <div class="initials"><ul><li></li></ul></div>
        </div>
    </div>`;

    creatNewPopup(html, function () {

    })
            },
            // 室内地图 
            IndoorMap:function(){
                var self = this;
                app.router.navigate("/showLayerOrFmap/"+self.id+"/")
            },
            //跳转至预案详情
            backToPlanInfo: function () {
                var self = this;
                app.router.navigate("/planLibraryDetails/" + self.planId + "/" + " " + "/" + " " + "/");
            },
            quitCancel: function () {
                var self = this;
                app.router.navigate(`/immediateAtten/` + this.$route.params.recordId + `/` + moment(this.$route.params.createTime).format("YYYY-MM-DD HH:mm:ss") + `/` + self.handlerStatus + `/` +  self.orgId + `/` +  self.fireSTypes + `/` + self.fcFacilitiesId + `/`);
            },
            gotoRealPolice: function () {
                var self = this;
                app.router.navigate("/eqmentMsg/" + this.id + "/");
            },
            //查看处理记录
            emergencyPlan: function () {
                var self = this;
                Dao.getRecordsHandleList({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    fireTypeId: 0,
                    recordIds: this.$route.params.recordId
                }, function (data) {
                    if(data.length==0){
                        jQuery('.nullItem').hide()
                        jQuery('.dealType').hide()
                        jQuery('.is-ladder-control').hide()
                    }else{
                    if(data[0].status==2){
                        jQuery('.dealType').hide()
                        jQuery('#dealTypeTime_' + self.getNewId).text('领取时间：')
                        $("#dealmsg_dealTime_" + self.getNewId).html(data[0].createTime);
                    }else{
                        jQuery('#dealTypeTime_' + self.getNewId).text('处理时间：')
                        jQuery('.dealType').show()
                    
                    }
                    if(data[0].disableElevator == -1){
                        jQuery('.is-ladder-control').hide()
                    }else if(data[0].disableElevator == 1){
                        if(data[0].disableEndTime == '永久禁用'){
                            $('#ladder_control_' + self.getNewId).html("永久禁用")
                        }else{
                            $('#ladder_control_' + self.getNewId).html("<span>禁用，禁用期为"+data[0].disableStartTime+"-</span>"+'</br><span>'+data[0].disableEndTime+'</span>')
                        }
                        
                    }else if(data[0].disableElevator == 0){
                        $('#ladder_control_' + self.getNewId).html("不禁用")
                    }
                }
                    $("#deal_police_" + self.getNewId).show();
                    if (data && data.length > 0 && data[0].status == 1) {
                        $("#dealmsg_status_" + self.getNewId).html("已处理");
                        $("#dealmsg_person_" + self.getNewId).html(data[0].operatorName);
                        if (data[0].updateTime == null) {
                            $("#dealmsg_dealTime_" + self.getNewId).html(data[0].createTime);
                        } else {
                            $("#dealmsg_dealTime_" + self.getNewId).html(data[0].updateTime);
                        }
                        $("#dealmsg_dealType_" + self.getNewId).html(data[0].handleTypeName);
                        $("#dealmsg_remark_" + self.getNewId).html(data[0].remark);
                        if (data[0].remarkVoice != null && data[0].remarkVoice != "") {
                            $("#voice_content_" + self.getNewId).show();
                            $("#dealmsg_voice_" + self.getNewId).empty();
                            $("#dealmsg_voice_" + self.getNewId).append(
                                `<audio id="audioId_"` + self.getNewId + ` preload="auto" hidden="true">
                                    <source src="` + data[0].remarkVoice + `" type="audio/mpeg">
                                </audio>
                                <img class="tb-voice-png"  id="gif_"` + self.getNewId + ` style="float: left;margin: 8px 4px;" src='` + self.imgPath + `'>
                                <p style="color: #fff;background:#509dff;border-radius:3px;font-size:15px;">语音播放</p>`);
                            if (data[0].remarkVoice != null && data[0].remarkVoice != "") {
                                jQuery("#dealmsg_voice").on("click", {
                                    'time': data[0].voiceLength
                                }, function (e) {
                                    var time = e.data.time ? e.data.time : 1;
                                    var audioArray = $(".tb-voice").find("audio");
                                    for (var i = 0; i < audioArray.length; i++) {
                                        audioArray[i].pause();
                                    }
                                    var audio = $("#audioId_"+self.getNewId)[0];
                                    if ($("#gif_"+self.getNewId).hasClass("tb-voice-png")) {
                                        audio.play(); // 这个就是播放
                                        $("#gif_"+self.getNewId).attr('src', ' ');
                                        $("#gif_"+self.getNewId).attr('src', self.gifPath);
                                        $("#gif_"+self.getNewId)[0].removeAttribute("tb-voice-png");
                                        $("#gif_"+self.getNewId)[0].setAttribute("class", "tb-voice-gif");
                                        self.dshiqi = setTimeout(function () { //dshiqi是外层定义好的一个变量！
                                            $("#gif_"+self.getNewId).attr('src', self.imgPath); //播放完毕去除动画
                                            $("#gif_"+self.getNewId)[0].removeAttribute("tb-voice-gif");
                                            $("#gif_"+self.getNewId)[0].setAttribute("class", "tb-voice-png");
                                        }, time * 1000)
                                    } else {
                                        audio.pause(); // 这个就是暂停
                                        $("#gif_"+self.getNewId).attr('src', self.imgPath);
                                        $("#gif_"+self.getNewId)[0].removeAttribute("tb-voice-gif");
                                        $("#gif_"+self.getNewId)[0].setAttribute("class", "tb-voice-png");
                                        clearTimeout(self.dshiqi);
                                    }
                                });
                            }
                        } else { //无语音
                            $("#voice_content_" + self.getNewId).hide();
                            $("#dealmsg_voice_" + self.getNewId).empty();
                            /*$("#dealmsg_voice").append(`<img class="tb-voice-png" style="float: left;" src='`+ self.noimgPath+`'>
                                                                        <p style="color:#d1d1d1;">无语音</p>`);*/
                        }
                        //现场图片
                        if (data[0].picUrl && data[0].picUrl != "") {
                            $("#dealmsg_img_" + self.getNewId).empty();
                            var images = data[0].picUrl.split(',');
                            for (var j = 0; j < images.length; j++) {
                                if(images[j].substr(images[j].length - 3) === 'mp4' || images[j].substr(images[j].length - 3) === '3gp' || images[j].substr(images[j].length - 4) === 'mpeg' || images[j].substr(images[j].length - 6) === 'mavip4' || images[j].substr(images[j].length - 3) === 'flv' || images[j].substr(images[j].length - 3) === 'mov'){
                                    $("#dealmsg_img_" + self.getNewId).append(`
                                  <div class="dealmsg-img-item"><img data-src="` + images[j] + `" class="my_image my_image_` + data[0].id +  `" src="` + staticPath + `img/common/video-detail.png" /></div>`);
                                }else{
                                    $("#dealmsg_img_" + self.getNewId).append(`
                                  <div class="dealmsg-img-item"><img data-src="` + images[j] + `" class="my_image my_image_` + data[0].id +  `" src="` + images[j] + `?imageView2/0/w/300/h/300"></div>`);
                                }
                            }
                            jQuery(".my_image_" + data[0].id).off().on("click", function (e) {
                                var pictureArr = [];
                                var imgUrlObj = this.parentElement.children;
                                var imgIndex = $(this).index("img");
                                jQuery.each(imgUrlObj, function (index, el) {
                                    // var obj = {};
                                    // obj.url = $(el).attr("data-src");
                                    pictureArr.push($(el).attr("data-src"));
                                });
                                openAndShowBigImage(pictureArr, imgIndex);
                            });

                        }
                        if (data[0].isOpenPlan == 1 && data[0].planId) {
                            $("#police_relate_emgency_" + self.getNewId).show();
                            self.planId = data[0].planId;
                            $("#police_relate_emgency_name_" + self.getNewId).html(data[0].planName);
                        } else {
                            $("#police_relate_emgency_" + self.getNewId).hide();
                        }
                    } else {
                        if (data && data.length > 0 && data[0].status == 2) {
                            $("#dealmsg_person_" + self.getNewId).html(data[0].operatorName);
                        }
                        // if (!data || data.length == 0) {
                        //     $("#deal_police_" + self.getNewId).hide();
                        // }
                    }
                });
            },
            //查看视频
            findVedioNum: function (fcfId) {
                videoData = [];
                Dao.getFcfRelateVideos({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    relateObjType: 1,
                    relateObjId: fcfId, //探测器id
                    account: userInfor.accountName
                }, function (data) {
                    if (data && data.length > 0) {
                        jQuery(".decter_video_num").html(`有` + data.length + `路监控`);
                        if (data.length == 1) {
                            if (videoData[data[0].id] == null) {
                                videoData[data[0].id] = data[0];
                            }
                            jQuery(".decter_video_num_video").off().on("click",function () {
                                var videoBean = {};
                                videoBean.id = data[0].id;
                                videoBean.deviceId = data[0].deviceId;
                                videoBean.type = data[0].type;
                                videoBean.name = data[0].name;
                                videoBean.channel = data[0].channel;
                                videoBean.status = data[0].status;
                                videoBean.picUrl = data[0].picUrl;
                                videoBean.isOnline = data[0].isOnline;
                                videoBean.isConcem = data[0].isConcem == null ? 0 : data[0]
                                .isConcem;
                                Dao.getAuthList({
                                    userName: userInfor.accountName,
                                    deviceId: appKeyObj.deviceId,
                                    organizationId: data[0].organizationId,
                                    equiptType: videoBean.type,
                                    orgCode: userInfor.org.orgCode,
                                    authId: data[0].authId
                                }, function (data) {
                                    var videoKeyBean = data[0];
                                    native.openVideo(JSON.stringify(videoKeyBean), JSON
                                        .stringify(videoBean));
                                });
                            });
                        } else {
                            jQuery("#decter_video_" + self.getNewId).attr('href', '/comvdList/' + fcfId + '/');
                        }
                    } else {
                        jQuery("#decter_video_num_" + self.getNewId).html("无");
                        jQuery("#decter_video_" + self.getNewId).attr('href', '');
                    }
                });
            },
            //获取详情
            getPoliceDetail: function () {
                var self = this;
                common.loading(1);
                Dao.analogDetails({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    recordId: this.$route.params.recordId,
                    createTime: this.$route.params.createTime,
                }, function (dataDetail) {
                    $("#history_topChartContain_" + self.getNewId).empty();
                    self.fireSTypes = dataDetail.fireSTypes
                    self.fcFacilitiesId = dataDetail.fcFacilitiesId
                    self.policeId = dataDetail.id;
                    self.testOrgId = dataDetail.organizationId;
                    self.isReset=dataDetail.isReset
                    //获取是否有快速处理
                    self.getIsHasTest();
                    self.orgId = dataDetail.organizationId;
                    //判断警情是否复位和警情是否有指派人
                    if (dataDetail.isReset == 0 && dataDetail.handlerAccount == '') {
                        $("#policeHistoryDetail_quit_" + self.getNewId).show();
                        $("#policeHistoryDetail_quit2_" + self.getNewId).hide();
                    } else {
                        $("#policeHistoryDetail_quit_" + self.getNewId).hide();
                        $("#policeHistoryDetail_quit2_" + self.getNewId).show();
                        if( dataDetail.handlerAccount==userInfor.accountName || dataDetail.handlerAccount == ''){
                            $("#policeHistoryDetail_quit3_" + self.getNewId).show();
                        }else{
                            $("#policeHistoryDetail_quit3_" + self.getNewId).hide();
                        }
                        if(dataDetail.handlerStatus == -1){
                            $("#policeHistoryDetail_quit3_" + self.getNewId).html("立即处理")
                            var id = dataDetail.id;
                            var createTime = dataDetail.createTime;
                            var handlerStatus = dataDetail.handlerStatus;
                            var organizationId = dataDetail.organizationId;
                            var fireSTypes = dataDetail.fireSTypes;
                            var fcFacilitiesId = dataDetail.fcFacilitiesId;
                            $("#policeHistoryDetail_quit3_" + self.getNewId).click(function(data){
                                app.router.navigate(`/immediateAtten/`+id+`/`+moment(createTime).format("YYYY-MM-DD HH:mm:ss")+`/`+handlerStatus+`/`+organizationId+`/`+fireSTypes+`/`+fcFacilitiesId+`/`);
                            })
                            
                        }else if(dataDetail.handlerStatus == 1){
                            $("#policeHistoryDetail_quit3_" + self.getNewId).hide()
                        }else{
                            var id = dataDetail.id;
                            var createTime = dataDetail.createTime;
                            var handlerStatus = dataDetail.handlerStatus;
                            var organizationId = dataDetail.organizationId;
                            var fireSTypes = dataDetail.fireSTypes;
                            var fcFacilitiesId = dataDetail.fcFacilitiesId;
                            $("#policeHistoryDetail_quit3_" + self.getNewId).html("继续处理")
                            $("#policeHistoryDetail_quit3_" + self.getNewId).click(function(data){
                                app.router.navigate(`/immediateAtten/`+id+`/`+moment(createTime).format("YYYY-MM-DD HH:mm:ss")+`/`+handlerStatus+`/`+organizationId+`/`+fireSTypes+`/`+fcFacilitiesId+`/`);
                            })
                        }
                    }
                    if (dataDetail.icon) {
                        $("#myicon_" + self.getNewId).attr('src', picDecterNo(JSON.parse(dataDetail.icon).detailIcon));
                    } else {
                        $("#myicon_" + self.getNewId).attr('src', picDecterNo());
                    }
                    $("#decterType_" + self.getNewId).html(transFireIcon(dataDetail.fireTTypes));
                    //判断复位方式
                    if (dataDetail.resetMode == 0) {
                        jQuery("#policeHistory_rest_type" + self.getNewId).html('自复位')
                    }else{
                        jQuery("#policeHistory_rest_type" + self.getNewId).html('手动处理复位')
                    }
                    //判断警情是否复位
                    if (dataDetail.isReset != 1) {
                        jQuery("#policeHistory_rest_detail_" + self.getNewId).empty().append("未复位").addClass("no-reset");
                        if(dataDetail.handlerStatus == 1){
                            $("#policeHistoryDetail_quit_"+self.getNewId).hide();
                        }
                        self.togglePic(1)
                    }else{
                        $('#tabReset_'+ self.getNewId).addClass('is-show')
                        $('#tagReset_'+ self.getNewId).addClass('is-show')
                        $("#policeHistoryDetail_quit_"+self.getNewId).hide();
                    }
                    //判断是否处理
                    self.handlerStatus = dataDetail.handlerStatus;
                    if (dataDetail.handlerStatus == 1) {
                        $("#dealmsg_status_" + self.getNewId).html("已处理");
                    } else if (dataDetail.handlerStatus == 2) {
                        $("#dealmsg_status_" + self.getNewId).html("已领取");
                        if (dataDetail.handlerAccount != userInfor.accountName) {
                        }
                    } else {
                        $("#dealmsg_status_" + self.getNewId).html("未处理");
                    }
                    //是否显示处理测试
                    if (self.isPoliceTest) {
                        if (dataDetail.handlerStatus == 1) {
                            $("#handel-protect-test_"+self.getNewId).hide();
                        } else if (dataDetail.isReset == 0){
                            $("#handel-protect-test_"+self.getNewId).show();
                        }
                    } else {
                        $("#handel-protect-test_"+self.getNewId).hide();
                    }
                    $("#msg_openTime_" + self.getNewId).empty().append(common.transNullundefinedToline(moment(dataDetail
                        .storageTime).format("YYYY-MM-DD HH:mm:ss")));
                    $("#msg_restTime_" + self.getNewId).empty().append(common.transNullundefinedToline(dataDetail.resetTime ?
                        moment(dataDetail.resetTime).format("YYYY-MM-DD HH:mm:ss") : dataDetail.resetTime));
                    $("#msg_policeDetail_" + self.getNewId).empty().append(common.transNullundefinedToline(dataDetail.selfDesc));
                    $("#decter_name_" + self.getNewId).html(common.transNullundefinedToline(dataDetail.fcfName));
                    $("#decter_address_" + self.getNewId).empty().append(common.transNullundefinedToline(dataDetail.selfDesc
                        .substr(0, dataDetail.selfDesc.indexOf(dataDetail.fcfName))));
                    $("#decter_continue_time_" + self.getNewId).empty().css("color", transFireColor(dataDetail.fireTTypes)).append(
                        common.transNullundefinedToline(dataDetail.continueTime));
                    //基本信息
                    $("#msg_11_" + self.getNewId).html(common.transNullundefinedToline(dataDetail.orgnizationName));
                    $("#msg_21_" + self.getNewId).html(common.transNullundefinedToline(dataDetail.fireBuildingName));
                    $("#msg_31_" + self.getNewId).html(common.transNullundefinedToline(dataDetail.fireSystemName));
                    $("#msg_41_" + self.getNewId).html(common.transNullundefinedToline(dataDetail.producerName));
                    $("#msg_51_" + self.getNewId).html(common.transNullundefinedToline((dataDetail.fcfCreateTime)));
                    //关注信息
                    self.isConcern = dataDetail.isCollect;
                    if (dataDetail.isCollect == 1) {
                        $("#noAttention_" + self.getNewId).hide();
                        $("#attention_" + self.getNewId).css("color", "red");
                        $("#attention_" + self.getNewId).show();
                    }
                    $("#history_topChartContain_" + self.getNewId).empty()
                    //是否是模拟量
                    if (dataDetail.hasAnalog > 0) {
                        if(dataDetail.hasAnalog==2){
                            self.showEquipmentStatus(dataDetail)
                        }
                        self.getThisTimeAnalogData(dataDetail, dataDetail.fireTTypes);
                    } else {
                        //是视频分析类型 这里是图片功能
                        if (dataDetail.isVideoAnalysis == 1) {
                            self.detailValie = {};
                            self.detailValie.picAlarmRegion = dataDetail.picAlarmRegion
                            self.detailValie.picResetRegion = dataDetail.picResetRegion
                            // 轮播图
                            $("#history_topChartContain_" + self.getNewId).html(`
                            <div id="hiddenCheck-swiper_${self.getNewId}" class="swiper-container">
                                <div class="swiper-wrapper" id="hiddenCheck_swiper_${self.getNewId}"></div>
                                <div class="swiper-pagination" id="hiddenCheck_pagination_${self.getNewId}"></div>
                            </div>`);
                            if (dataDetail.picturesUrls) {
                                $('.eqmentMsg-page .sw-tabs').addClass('is-show')
                                $("#hiddenCheck_swiper_"+self.getNewId).empty();
                                // 报警复位图片都存在时创建swiper
                                if (dataDetail.resetPicturesUrls) {
                                    var hiddenCheck_swiper = new Swiper('#hiddenCheck-swiper_'+self.getNewId, {
                                        direction: 'horizontal',
                                        loop: false,
                                        slidesPerView: "auto",
                                        pagination: {
                                            el: '#hiddenCheck_pagination_'+self.getNewId,
                                        },
                                        on:{
                                            slideChange:()=>{
                                                $('.eqmentMsg-page').find('.sw-tabs__item').removeClass('is-active')
                                                $('.eqmentMsg-page').find('.sw-tabs__item').eq(hiddenCheck_swiper.activeIndex).addClass('is-active')
                                            }
                                        }
                                    });
                                }
                                var swiper = app.swiper.get('#hiddenCheck-swiper_'+self.getNewId);
                                // 复位图片
                                let resultRegionReset = dataDetail.picResetRegion; // picResetRegion（复位）    picAlarmRegion（报警）
                                if (resultRegionReset) {
                                    resultRegionReset = JSON.parse(resultRegionReset);
                                    let frameArr = {}
                                    frameArr = resultRegionReset.imageInfo;
                                    $("#hiddenCheck_swiper_"+self.getNewId).append(`
                                    <div class="swiper-slide" style="text-align: center;">
                                        <div id="show-vedio-btn_two_`+self.getNewId+`" class="show-vedio-btn" style="z-index: 999">查看监控</div>
                                        <img id="imagetoReset" src="` + picVedioNo(frameArr.pic+"?imageView2/2/w/95%/h/180/q/25") + `" style="width:95%;height:180px;z-index: 9;" onload="vanimageLoadReset()" class="lazy lazy-fade-in" crossOrigin="Anonymous"οnclick="ResetImgClick"/>
                                        <canvas style="visibility: hidden !important;width:95%;height:180px;background-color:transparent;position: absolute;left:8px"  id="policeHistoryDetail_scaleImgReset_"/>
                                    </div>`);
                                    swiper&&swiper.update(true); // 更新滑块
                                }
                                // 报警图片
                                let resultRegionAlarm = dataDetail.picAlarmRegion; // picResetRegion（复位）    picAlarmRegion（报警）
                                if (resultRegionAlarm) {
                                    resultRegionAlarm = JSON.parse(resultRegionAlarm);
                                    let frameArr = {}
                                    frameArr = resultRegionAlarm.imageInfo;
                                    $("#hiddenCheck_swiper_"+self.getNewId).append(`
                                    <div class="swiper-slide" style="text-align: center;">
                                        <div id="show-vedio-btn_`+self.getNewId+`" class="show-vedio-btn" style="z-index: 999">查看监控</div>
                                        <img id="imagetoAlarm" src="` + picVedioNo(frameArr.pic+"?imageView2/2/w/95%/h/180/q/25") + `" style="width:95%;height:180px;z-index: 9;" onload="vanimageLoad()" class="lazy lazy-fade-in" crossOrigin="Anonymous" οnclick="ImgClick"/>
                                        <canvas style="visibility: hidden !important;width:95%;height:180px;position: absolute;left:8px"  id="policeHistoryDetail_scaleImg_"/>
                                    </div>`);
                                    swiper&&swiper.update(true); // 更新滑块
                                }
                                common.loading(1);
                            } else {
                                $("#history_topChartContain_" + self.getNewId).empty();
                                common.loading(0);
                            }
                            //放大图片 在这里吧canvas转图片，然后塞给图片预览
                            jQuery("#hiddenCheck_swiper_" + self.getNewId+" #imagetoAlarm").bind("click",function() {
                                let imgpic = []
                                // 有复位
                                if (dataDetail.resetPicturesUrls) { 
                                    imgpic.push({url:self.image_R}) 
                                }
                                // 有报警
                                imgpic.push({url:self.image_A})
                                if (self.image_A) {
                                    if (dataDetail.resetPicturesUrls) {
                                        if (self.image_R) {
                                            openAndShowBigImage(imgpic,1);
                                        } else {
                                            app.methods.showToastCenter("图像生成中...");
                                        }
                                    }else {
                                        openAndShowBigImage(imgpic,0);
                                    }
                                } else {
                                    app.methods.showToastCenter("图像生成中...");
                                }
                            });
                            //放大图片 在这里吧canvas转图片，然后塞给图片预览
                            jQuery("#imagetoReset").bind("click",function() {
                                if (self.image_A&& self.image_R) {
                                    openAndShowBigImage([{url:self.image_R},{url:self.image_A}],0);   
                                } else {
                                    app.methods.showToastCenter("图像生成中...");
                                }
                            });
                            
                            // 查看监控按钮
                            jQuery("#show-vedio-btn_"+self.getNewId).off().on('click', {
                                'data': dataDetail
                            }, function (event) {
                                // console.log('按钮没问题')
                                var data = event.data.data.videoList;
                                videoData = [];
                                Dao.getFcfRelateVideos({
                                    userName: userInfor.accountName,
                                    deviceId: appKeyObj.deviceId,
                                    relateObjType: 1,
                                    relateObjId: self.id * 1,
                                    account: userInfor.accountName,
                                }, function (data) {
                                    if (data != null && data.length > 0) {
                                        if (videoData[data[0].id] == null) {
                                            videoData[data[0].id] = data[0];
                                        }
                                        self.videoBean.id = data[0].id;
                                        self.videoBean.deviceId = data[0].deviceId;
                                        self.videoBean.type = data[0].type;
                                        self.videoBean.name = data[0].name;
                                        self.videoBean.channel = data[0].channel;
                                        self.videoBean.status = data[0].status;
                                        self.videoBean.picUrl = data[0].picUrl;
                                        self.videoBean.isOnline = data[0].isOnline;
                                        self.videoBean.region = data[0].region;
                                        self.videoBean.organizationId = data[0].organizationId;
                                        self.videoBean.isConcem = data[0].isConcem == null ?0 : data[0].isConcem;
                                        Dao.getAuthList({
                                            userName: userInfor.accountName,
                                            deviceId: appKeyObj.deviceId,
                                            organizationId: data[0].organizationId,
                                            equiptType: data[0].type,
                                            orgCode: userInfor.org.orgCode,
                                            authId: data[0].authId
                                        }, function (data) {
                                            common.loading(0);
                                            var videoKeyBean = data[0];
                                            native.openVideo(JSON.stringify(videoKeyBean), JSON.stringify(self.videoBean));
                                        });
                                    } else {
                                        app.methods.showToastCenter("暂无播放此视频权限");
                                    }
                                });
                            });
                            // 查看监控按钮
                            jQuery("#show-vedio-btn_two_"+self.getNewId).off().on('click', {
                                'data': dataDetail
                            }, function (event) {
                                console.log('按钮没问题')
                                var data = event.data.data.videoList;
                                videoData = [];
                                Dao.getFcfRelateVideos({
                                    userName: userInfor.accountName,
                                    deviceId: appKeyObj.deviceId,
                                    relateObjType: 1,
                                    relateObjId: self.id * 1,
                                    account: userInfor.accountName,
                                }, function (data) {
                                    if (data != null && data.length > 0) {
                                        if (videoData[data[0].id] == null) {
                                            videoData[data[0].id] = data[0];
                                        }
                                        self.videoBean.id = data[0].id;
                                        self.videoBean.deviceId = data[0].deviceId;
                                        self.videoBean.type = data[0].type;
                                        self.videoBean.name = data[0].name;
                                        self.videoBean.channel = data[0].channel;
                                        self.videoBean.status = data[0].status;
                                        self.videoBean.picUrl = data[0].picUrl;
                                        self.videoBean.isOnline = data[0].isOnline;
                                        self.videoBean.region = data[0].region;
                                        self.videoBean.organizationId = data[0].organizationId;
                                        self.videoBean.isConcem = data[0].isConcem == null ?0 : data[0].isConcem;
                                        Dao.getAuthList({
                                            userName: userInfor.accountName,
                                            deviceId: appKeyObj.deviceId,
                                            organizationId: data[0].organizationId,
                                            equiptType: data[0].type,
                                            orgCode: userInfor.org.orgCode,
                                            authId: data[0].authId
                                        }, function (data) {
                                            common.loading(0);
                                            var videoKeyBean = data[0];
                                            native.openVideo(JSON.stringify(videoKeyBean), JSON.stringify(self.videoBean));
                                        });
                                    } else {
                                        app.methods.showToastCenter("暂无播放此视频权限");
                                    }
                                });
                            });
                            
                            
                        } else {
                            self.showEquipmentStatus(dataDetail)
                        }
                    }
                    self.changeFont();
                });
            },
            showEquipmentStatus(dataDetail){
                var self=this
                var statusAlias = dataDetail.statusAlias;
                if (!statusAlias) {
                    statusAlias = transFireToText(dataDetail.fireTTypes);
                }
                $("#history_topChartContain_" + self.getNewId).append(`
                    <div class="no-hasAnalog">
                        <div class="no-hasAnalog-left">
                            <img src="` + picDecterNo(dataDetail.fireTypeUrl) + `" />
                        </div>
                        <div class="no-hasAnalog-right">
                            <p class="no-hasAnalog-typeText" style="color:` +
                            transFireColor(dataDetail.fireTTypes) + `">
                            ` + statusAlias + `</p>
                            <span class="no-hasAnalog-type">警情状态</span>
                        </div>
                    </div>`
                );
                common.loading(0);
            },
            //定义变量获取屏幕视口宽度且改变样式
            changeFont(){
                let self = this
                let windowWidth = $(window).width();
                let look__detail = $("#history_topChartContain_" + self.getNewId + ' .every-type-chart-wrap .right-num span')
                if(windowWidth<=320){
                    look__detail.css("font-size","26px");
                }else if(windowWidth<=340){
                    look__detail.css("font-size","28px");
                }else if(windowWidth<=360){
                    look__detail.css("font-size","30px");
                }else if(windowWidth<=400){
                    look__detail.css("font-size","32px");
                }else if(windowWidth<=420){
                    look__detail.css("font-size","34px");
                }
            },
            ImgClick() {
                console('报警图片被点击')
            },
            ResetImgClick() {
                console('复位图片被点击')
            },
            //获取消防设施某个时间点的模拟量
            getThisTimeAnalogData: function (data, fireTTypes) {
                var self = this;
                Dao.getFacsAnalogDataByTimeAjax({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    fcfId: self.id * 1,
                    createTime: data.createTime
                }, function (re) {
                    if (re && re.length > 0) {
                        self.getHistoryChartValue(re, fireTTypes);
                    }
                    common.loading(0);
                });
            },
            getHistoryChartValue: function (data, fireTTypes) {
                var self = this;
                if (data && data.length > 0) {
                    //处理模拟量类型数据  设备电压不画
                    for (var i = 0; i < data.length; i++) {
                        if (data[i].dataTypeId != 3) {
                            if (data[i].detail && data[i].detail.length > 0) {
                                var lastData = data[i].detail[(data[i].detail.length - 1)];
                                var lastDataAnalogValue = lastData.analogValue;
                                var lastDataAnalogUnits = lastData.analogUnits;
                                var lastDataTypeName = data[i].dataTypeName;
                                var lastDataThresholdMax = data[i].thresholdMax;
                                var lastDataThresholdMin = data[i].thresholdMin;
                                var waterArea = 0;
                                if (data[i].waterArea != undefined || data[i].waterArea != null || data[i]
                                    .waterArea != "") {
                                    waterArea = data[i].waterArea;
                                }
                                self.showEveryChart(fireTTypes, data[i].dataTypeId, lastDataAnalogValue,lastDataAnalogUnits, lastDataTypeName, lastDataThresholdMax,lastDataThresholdMin);
                            }
                        }
                    }
                }
            },
            showEveryChart: function (fireTTypes, dataTypeId, lastDataAnalogValue, lastDataAnalogUnits,
                lastDataTypeName, lastDataThresholdMax, lastDataThresholdMin, waterArea) {
                var self = this;
                var min = 0;
                var max = 2.5;
                var splitNumber = 5;
                var color = "#77be07";
                if (lastDataAnalogValue <= lastDataThresholdMin || lastDataAnalogValue >= lastDataThresholdMax) {
                    color = "#fe6668";
                } else {
                    color = "#77be07";
                }
                lastDataAnalogValue = lastDataAnalogValue.toFixed(2);
                var lastDataAnalogUnitsTxt=lastDataAnalogUnits?`<br/>（${lastDataAnalogUnits}）`:''
                //是组合式电气火灾探测器
                if (self.dataTypeIdArr_history.find((n) => n == dataTypeId)) {
                    jQuery("#history_decter_table_" + self.getNewId).show();
                    if (dataTypeId == 33) {
                        jQuery("#policeHistory_electricity_" + self.getNewId).show();
                    }
                    if (dataTypeId == 30) {
                        jQuery("#policeHistory_voltage_" + self.getNewId).show();
                    }
                    jQuery("#history_decterMes_" + dataTypeId + "_" + self.getNewId).html(`<span style="color:` + color + `">` +
                        lastDataAnalogValue + lastDataAnalogUnits + `</span>`);
                    //剩余电流码表
                    if (dataTypeId == 39) {
                        $("#history_topChartContain_" + self.getNewId).append(`
                                <div class="every-type-chart-wrap">
                                    <div class="every-type-chart decterHasAnalogChart-style" id="history_historyChart_`+ ( self.getNewId + "_" + dataTypeId  ) + `"></div>
                                    <div class="right-num">
                                        <span style="color:` + color + `">` + lastDataAnalogValue + `</span>
                                        <p>` + lastDataTypeName + lastDataAnalogUnitsTxt + `</p>
                                    </div>
                            </div>`
                        );
                        self.drawHalfClockChart_history(dataTypeId, lastDataAnalogValue, lastDataAnalogUnits, 0,1000, 5);
                    }
                } else {
                    if (dataTypeId == 2) {
                        if (waterArea > 0) {
                            waterVolume = common.mul(waterArea, lastDataAnalogValue);
                            $("#history_topChartContain_" + self.getNewId).append(`
                            <div class="every-type-chart-wrap">
                                <div class="every-type-chart decterHasAnalogChart-style" id="history_historyChart_` + ( self.getNewId + "_" + dataTypeId  )  + `"></div>
                                <div class="right-num">
                                    <em class="water-volume" style="color:` + color + `">计:` + waterVolume + `m³</em>
                                    <span style="color:` + color + `">` + lastDataAnalogValue + `</span>
                                    <p>` + lastDataTypeName + lastDataAnalogUnitsTxt + `</p>
                                </div>
                        </div>`);
                        } else {
                            $("#history_topChartContain_" + self.getNewId).append(`
                            <div class="every-type-chart-wrap">
                                <div class="every-type-chart decterHasAnalogChart-style" id="history_historyChart_` + ( self.getNewId + "_" + dataTypeId  )  + `"></div>
                                <div class="right-num">
                                    <span style="color:` + color + `">` + lastDataAnalogValue + `</span>
                                    <p>` + lastDataTypeName + lastDataAnalogUnitsTxt + `</p>
                                </div>
                        </div>`);
                        }

                    } else {
                        $("#history_topChartContain_" + self.getNewId).append(`
                            <div class="every-type-chart-wrap">
                                <div class="every-type-chart decterHasAnalogChart-style" id="history_historyChart_` + ( self.getNewId + "_" + dataTypeId  )  + `"></div>
                                <div class="right-num">
                                    <span style="color:` + color + `">` + lastDataAnalogValue + `</span>
                                    <p>` + lastDataTypeName + lastDataAnalogUnitsTxt + `</p>
                                </div>
                        </div>`);
                    }
                    //压力
                    if (dataTypeId == 1) {
                        self.drawClockChart_history(dataTypeId, lastDataAnalogValue, lastDataAnalogUnits, min, 2.5,
                            splitNumber);
                    }
                    //液位
                    else if (dataTypeId == 2) {
                        self.drawWaterChart_history(dataTypeId, (lastDataThresholdMax - lastDataAnalogValue),
                            lastDataAnalogValue);
                    }
                    //温度
                    else if (dataTypeId == 5) {
                        self.drawTempClockChart_history(dataTypeId, lastDataAnalogValue, lastDataAnalogUnits);
                    }
                    //湿度
                    else if (dataTypeId == 6) {
                        self.drawClockChart_history(dataTypeId, lastDataAnalogValue, lastDataAnalogUnits, min, 100,
                            10);
                    } else {
                        //电压
                        if (dataTypeId == 7 || dataTypeId == 8 || dataTypeId == 9) {
                            max = 450;
                            splitNumber = 3;
                        }
                        //电流
                        else if (dataTypeId == 10 || dataTypeId == 11 || dataTypeId == 12) {
                            max = 100;
                            splitNumber = 5;
                        }//信号强度
                        else if (dataTypeId == 41) {
                            min = -110
                            max = 100
                        }
                        self.drawHalfClockChart_history(dataTypeId, lastDataAnalogValue, lastDataAnalogUnits, min,max,
                            splitNumber);
                    }
                }
                //定义变量获取屏幕视口宽度且改变样式
                self.changeFont();
            },
            //码表-压力-湿度
            drawClockChart_history: function (dataTypeId, currentAnalogValue, currentAnalogUnits, min, max,
            splitNumber) {
                var self = this;
                var myChart_safetyIndex = echarts.init(document.getElementById("history_historyChart_"+ self.getNewId + "_" +  dataTypeId));
                var option_safetyIndex = {
                    tooltip: null,
                    series: [{
                        type: 'gauge',
                        min: min,
                        max: max,
                        radius: "70%",
                        center: ["30%", "52%"],
                        splitNumber: splitNumber,
                        //仪表盘标题。
                        title: {
                            show: true,
                            textStyle: {
                                fontSize: 15
                            }
                        },
                        axisLabel: { //文字样式（及“10”、“20”等文字样式）
                            distance: 5, //文字离表盘的距离
                            fontSize: 12,
                        },
                        axisLine: { // 坐标轴线
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: [
                                    [1, '#000']
                                ],
                                shadowBlur: 2,
                                width: 8,
                                shadowColor: '#000', //默认透明
                            }
                        },
                        axisTick: { // 坐标轴小标记
                            splitNumber: 5,
                            length: 14, // 属性length控制线长
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: '#000'
                            }
                        },
                        splitLine: { //分割线样式（及10、20等长线样式）
                            length: 18,
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: '#000'
                            }
                        },
                        pointer: {
                            length: '60%',
                            width: '3',
                        },
                        detail: {
                            formatter: currentAnalogUnits,
                            textStyle: {
                                fontSize: 12
                            },
                            offsetCenter: [0, "65%"],
                        },
                        data: [{
                            value: currentAnalogValue,
                            name: '',
                        }]
                    }]
                };
                if (option_safetyIndex && typeof option_safetyIndex === "object") {
                    myChart_safetyIndex.setOption(option_safetyIndex, true);
                }
            },
            //画水箱
            drawWaterChart_history: function (dataTypeId, top, bottom) {
                var self = this;
                var waterChart = echarts.init(document.getElementById("history_historyChart_"+ self.getNewId + "_" + dataTypeId));
                var option = {
                    title: null,
                    tooltip: {},
                    xAxis3D: {
                        type: 'category',
                        data: ['']
                    },
                    yAxis3D: {
                        type: 'category',
                        data: ['']
                    },
                    zAxis3D: {
                        type: 'value'
                    },
                    grid3D: {
                        show: false, //是否显示三维迪卡尔坐标
                        boxWidth: 80,
                        boxDepth: 20,
                        axisPointer: {
                            show: false
                        },
                        viewControl: {
                            alpha: 15, //视角绕 x 轴，即上下旋转的角度(与beta一起控制视野成像效果)
                            beta: 60 //视角绕 y 轴，即左右旋转的角度
                        },
                        top: "-5%", //组件的视图离容器上侧的距离
                        left: "-25%",
                        bottom: "-10%"
                    },
                    series: [{
                        type: 'bar3D',
                        barSize: 75,
                        data: [
                            [0, 0, bottom]
                        ],
                        stack: 'stack',
                        shading: 'lambert',
                        itemStyle: { //柱条样式
                            color: '#428ceb',
                            opacity: 0.9
                        },
                        emphasis: {
                            label: {
                                show: false
                            }
                        }
                    }, {
                        type: 'bar3D',
                        barSize: 75,
                        data: [
                            [0, 0, top]
                        ],
                        stack: 'stack',
                        shading: 'lambert',
                        itemStyle: { //柱条样式
                            color: '#428ceb',
                            opacity: 0.5
                        },
                        emphasis: {
                            label: {
                                show: false
                            }
                        }
                    }]
                }
                waterChart.setOption(option);
            },
            //码表-温度
            drawTempClockChart_history: function (dataTypeId, currentAnalogValue, currentAnalogUnits) {
                var self = this;
                var realNum = -25 - (currentAnalogValue);
                if (realNum <= 0) {
                    realNum = Math.abs(realNum);
                }
                var myChart_safetyIndex = echarts.init(document.getElementById("history_historyChart_"+ self.getNewId + "_" + dataTypeId));
                var option_safetyIndex = {
                    series: [{
                        type: 'gauge',
                        min: -25,
                        max: 100,
                        radius: "70%",
                        center: ["30%", "52%"],
                        splitNumber: 5,
                        //仪表盘标题。
                        title: {
                            show: true,
                            textStyle: {
                                fontSize: 15
                            }
                        },
                        axisLabel: { //文字样式（及“10”、“20”等文字样式）
                            distance: 5, //文字离表盘的距离
                            fontSize: 12,
                        },
                        axisLine: { // 坐标轴线
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: [
                                    [realNum / 125, '#fe6668'],
                                    [1, '#999']
                                ],
                                width: 8,
                                // shadowBlur: 2,
                                // shadowColor: '#999', //默认透明
                            }
                        },
                        axisTick: { // 坐标轴小标记
                            splitNumber: 5,
                            length: 3, // 属性length控制线长
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: '#fff'
                            }
                        },
                        splitLine: { //分割线样式（及10、20等长线样式）
                            length: 6,
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: '#fff',
                            }
                        },
                        pointer: {
                            length: '60%',
                            width: '3',
                        },
                        detail: {
                            formatter: currentAnalogUnits,
                            textStyle: {
                                fontSize: 12
                            },
                            offsetCenter: [0, "65%"],
                        },
                        data: [{
                            value: currentAnalogValue,
                            name: '',
                        }]
                    }]
                };
                if (option_safetyIndex && typeof option_safetyIndex === "object") {
                    myChart_safetyIndex.setOption(option_safetyIndex, true);
                }
            },
            //码表-ABC相-电气火灾剩余电流传感器
            drawHalfClockChart_history: function (dataTypeId, currentAnalogValue, currentAnalogUnits, min,max,
            splitNumber) {
                var self = this;
                var myChart_safetyIndex = echarts.init(document.getElementById("history_historyChart_"+ self.getNewId + "_" + dataTypeId));
                var option_safetyIndex = {
                    series: [{
                        type: 'gauge',
                        min: min,
                        max: max,
                        radius: "110%",
                        center: ["40%", "75%"],
                        startAngle: 180,
                        endAngle: 90,
                        splitNumber: splitNumber, //5等分
                        //仪表盘标题。
                        title: {
                            show: true,
                            textStyle: {
                                fontSize: 15
                            }
                        },
                        axisLabel: { //文字样式（及“10”、“20”等文字样式）
                            distance: 5, //文字离表盘的距离
                            fontSize: 12,
                        },
                        axisLine: { // 坐标轴线
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: [
                                    [1, '#000']
                                ],
                                shadowBlur: 2,
                                width: 8,
                                shadowColor: '#000', //默认透明
                            }
                        },
                        axisTick: { // 坐标轴小标记
                            splitNumber: 5,
                            length: 14, // 属性length控制线长
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: '#000'
                            }
                        },
                        splitLine: { //分割线样式（及10、20等长线样式）
                            length: 18,
                            lineStyle: { // 属性lineStyle控制线条样式
                                color: '#000'
                            }
                        },
                        pointer: {
                            length: '60%',
                            width: '3',
                        },
                        detail: null,
                        data: [{
                            value: currentAnalogValue,
                            name: '',
                        }]
                    }]
                };
                if (option_safetyIndex && typeof option_safetyIndex === "object") {
                    myChart_safetyIndex.setOption(option_safetyIndex, true);
                }
            },
            backToPrePage: function () {
                app.methods.freshEqment();
                app.methods.backToTab();
            },
            // openConfirm: function() {
            //     var self = this;
            //     if (self.isConcern == 1) { //取消关注
            //         app.params.dialog.buttonCancel = "取消";
            //         app.params.dialog.buttonOk = "确认";
            //         app.dialog.confirm('确认取消关注此设备?', '确认', function() {
            //             //取消关注
            //             common.loading(1);
            //             Dao.focusOnOff({
            //                 userAccount: userInfor.accountName,
            //                 userName: userInfor.accountName,
            //                 deviceId: appKeyObj.deviceId,
            //                 type: 4,
            //                 concemId: self.$route.params.recordId,
            //             }, function(data) {
            //                 common.loading(0);
            //                 $("#noAttention").css("color","#333333");
            //       	        $("#attention").hide();
            //       	        $("#noAttention").show();
            //             	app.methods.showToastCenter("取消关注成功");
            //                 self.isConcern = 0;
            //             }, function(e) {
            //                 common.loading(0);
            //                 app.methods.showToastCenter("取消关注失败");
            //             });
            //         });
            //     } else { //关注
            //         common.loading(1);
            //         Dao.addUserConcem({
            //             userName: userInfor.accountName,
            //             deviceId: appKeyObj.deviceId,
            //             userAccount: userInfor.accountName,
            //             type: 4,
            //             concemId: self.$route.params.recordId,
            //         }, function(data) {
            //             common.loading(0);
            //             app.methods.showToastCenter("关注成功");
            //             $("#noAttention").hide();
            //         	$("#attention").css("color","red");
            //         	$("#attention").show();
            //             self.isConcern = 1;
            //         }, function(e) {
            //             common.loading(0);
            //             app.methods.showToastCenter("关注失败");
            //         });
            //     }
            // },
            // "data": 1 //1表示有 0：表示无
            getIsHasTest: function () {
                var self = this;
                Dao.getMaintainTestCount({
                    orgId: self.testOrgId,
                    date: this.$route.params.createTime
                }, function (data) {
                    if (data == 1) {
                        self.isPoliceTest = true;
                    } else {
                        self.isPoliceTest = false;
                    }
                }, false);
            },
            //处理为测试
            handelTest() {
                var self = this;
                var info = [{
                    id: self.policeId,
                    createTime: this.$route.params.createTime
                }];
                Dao.handleFireRecord({
                    status: 1,
                    fireTypeId: 0,
                    operator: userInfor.accountName,
                    handleTypeId: 9,
                    remark: '',
                    remarkVoice: '',
                    planId: -1,
                    picUrl: '',
                    isOpenPlan: 0, //是否创建了应急救援，0未创建，1创建
                    recordsInfosStr: JSON.stringify(info).toString()
                }, function (data) {
                    app.methods.showToastCenter("警情处理成功");
                    $("#handel-protect-test_"+self.getNewId).hide();
                    self.emergencyPlan(self.id);
                });
            },
            refreshData(e,done){
                $('.eqmentMsg-page .ptr-preloader').show()
                this.getPoliceDetail();
                this.findVedioNum(this.id);
                this.emergencyPlan(this.id);
                setTimeout(()=>{
                    $('.eqmentMsg-page .ptr-preloader').hide()
                    done&&done()
                },2000)
            }
        },
        on: {
            pageInit: function (e, page) {
                var self = this;
                self.getPoliceDetail();
                self.findVedioNum(self.id);
                self.emergencyPlan(self.id);
                //室内定位
                $("#fmapHerf_" + self.getNewId).attr("href", "/showLayerOrFmap/" + self.id + "");
                window.vanimageLoad = self.vanimageLoad;
                window.vanimageLoadReset = self.vanimageLoadReset;
                window.ResetImgClick = self.ResetImgClick;
                window.ImgClick = self.ImgClick;
            },
            // pageAfterIn: function (e, page) {
            // },
        }
}
</script>